<template>
  <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="150" style="padding-right: 150px">
    <Form-item label="课室名称" prop="classroom_name">
      <Input v-model="formValidate.classroom_name"></Input>
    </Form-item>

    <Form-item>
      <Button type="primary" @click="handleSubmit('formValidate')">提交</Button>
      <Button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">重置</Button>
    </Form-item>
  </Form>
</template>

<script>
  import { RuleArray } from '../../rule/rule'
  export default {
    data () {
      return {
        formValidate: {
          classroom_name: ''
        },
        ruleValidate: RuleArray
      }
    },
    methods: {
      handleChange (value) {
        console.log(value)
      },
      handleSubmit (name) {
        this.$refs[name].validate((valid) => {
          if (valid) {
            this.$Message.success('提交成功!')
          } else {
            this.$Message.error('表单验证失败!')
          }
        })
      },
      handleReset (name) {
        this.$refs[name].resetFields()
      },
      CardTypeChange (value) {
        console.log(value)
      }
    }
  }
</script>
